// 轨迹数据格式
let linePath = [];
const pathList = [];
// 地图对象
const map = new AMap.Map("container", {
	resizeEnable: true,
	zoom: 15,
	showIndoorMap: false,
	center: [114.205173, 30.63413],
});
// 已经走了的时间
let passedTime = "00:00:00";
// 走的总时间
let totalTime = "00:00:00";
// 历史轨迹巡航器
let pathSimplifierIns = null;
// 巡航器
let navgtr = null;
// 基础播放速度
let speed = 100;
// 播放倍速
let times = 1;
// 是否为手动拉动进度条
let isOnSlider = false;
// 当前进度条的值
let sliderVal = 0;
// 播放状态
let isPlay = false;
// 开始按钮是重新开始还是继续
let playIcon = "resume";
const car = "https://webapi.amap.com/images/car.png";
// 数据
let collapseData;
// 折叠面板-字段配置
let collapseColumns = {
	"province-this": [{
			title: "车辆基本信息",
			prop: "rwVehicleBaseVO",
			type: 'info',
			columns: [{
					label: "车牌号(颜色)",
					format: (index) => {
						let veColor =
							collapseData[index].vehColor &&
							`(${collapseData[index].vehColor})`;
						return `${collapseData[index].vehCode}${veColor || ""}`;
					},
				},
				{
					label: "道路运输证号",
					prop: "ccertId",
				},
				{
					label: "有效期",
					format: (index) => {
						return ` ${collapseData[index].expireDate}`;
					},
				},
				{
					label: "营运状态",
					format: (index) => {
						return (
							selectOptions.ccert_state_obj[
								collapseData[index].ccertState
							] || ""
						);
					},
				},
				{
					label: "下次年审日期",
					prop: "nextCheckDate",
				},

				{
					label: "经营范围",
					prop: "mgrArea",
				},

				{
					label: "承运人责任险有效期",
					prop: "insuredValidDate",
				},

				// {
				// 	label: "下次等级评定日期",
				// 	prop: "nextVehRankDate",
				// },
			],
		},
		{
			title: "最后一次定位",
			prop: "carData",
			type: 'info',
			columns: [

				{
					label: "时间",
					prop: "lastGpsTime",
				},
				{
					label: "速度",
					prop: "speed",
				},

				{
					label: "地点",
					prop: "address",
				},
			],
		},
		{
			title: "门架抓拍记录",
			type: "table",
			prop: "portal",
			columns: [{
					label: "门架名称",
					prop: "mjName",
				},
				{
					label: "通过时间",
					prop: "transTime",
				},
			],
		},
		{
			title: "治超卡点记录",
			type: "table",
			prop: "zcList",
			columns: [{
					label: "检测站号",
					prop: "jczNo",
				},
				{
					label: "治超卡点名称",
					prop: "jczName",
				},
				{
					label: "检测时间",
					prop: "jcTime",
					width: 165
				},
			],
		},
		{
			title: "风险预警",
			type: "table",
			prop: "warningList",
			columns: [{
				label: "预警信息",
				prop: "warnInfo",
			}, ],
		},
		{
			title: "承运企业信息",
			prop: "carrieInfoVO",
			type: 'info',
			columns: [{
					label: "企业名称",
					prop: "ownerName",
				},
				{
					label: "许可证有效期",
					format: (index) => {
						return ` ${collapseData[index].expireDate}`;
					},
				},
				{
					label: "经营状态",
					format: (index) => {
						return (
							selectOptions.owner_state_obj[
								collapseData[index].state
							] || ""
						);
					},
				},
				{
					label: "经营范围",
					prop: "mgrArea",
				},
				{
					label: "经营许可证号",
					prop: "mcertId",
				},
				{
					label: "联系人",
					prop: "contacts",
				},
				{
					label: "联系电话",
					prop: "ptTel",
				},
			],
		},
		{
			title: "运单信息",
			type: "title2",
		},
		{
			title: "运单基本信息",
			prop: "wayBillInfoVO",
			type: "title3",
			columns: [{
					label: "运单编号",
					prop: "billNo",
				},
				{
					label: "起运地",
					prop: "loadingAddr",
				},
				{
					label: "目的地",
					prop: "unloadingAddr",
				},
				{
					label: "起运日期",
					prop: "startTransTime",
					format: (index) => {
						return collapseData[index].startTransTime.slice(0, 10);
					},
				},
				{
					label: "预计到达日期",
					prop: "endTransTime",
					format: (index) => {
						return collapseData[index].endTransTime.slice(0, 10);
					},
				},

				{
					label: "货物信息",
					prop: "goodsInfo",
				},


			],
		},
		{
			title: "挂车信息",
			prop: "trailerInforVO",
			type: "title3",
			columns: [{
					label: "挂车车牌号",
					format: (index) => {
						let str = collapseData[index].vehCode;
						str += collapseData[index].vehColor ?
							`(${collapseData[index].vehColor})` :
							"";
						return str;
					},
				},
				{
					label: "营运状态",
					format: (index) => {
						return (
							selectOptions.ccert_state_obj[
								collapseData[index].ccertState
							] || ""
						);
					},
				},
				{
					label: "经营范围",
					prop: "mgrArea",
				},
				{
					label: "道路运输证号",
					prop: "ccertId",
				},
				{
					label: "有效期",
					format: (index) => {
						return `${collapseData[index].firstDate} - ${collapseData[index].expireDate}`;
					},
				},

				{
					label: "下次年审日期",
					prop: "nextCheckDate",
				},

				{
					label: "承运人责任险有效期",
					prop: "insuredValidDate",
				},

				// {
				// 	label: "下次等级评定日期",
				// 	prop: "nextCheckDate",
				// },
			],
		},
		{
			title: "驾押人员信息",
			prop: "staffInfoVO",
			type: "title3",
			columns: [{
					label: "驾驶员姓名",
					prop: "driverName",
				},
				{
					label: "从业资格证",
					prop: "driverCertNo",
				},
				{
					label: "押运员姓名",
					prop: "escortName",
				},
				{
					label: "从业资格证",
					prop: "escortCertNo",
				},
			],
		},
		{
			title: "行车日志",
			prop: "outTrafficVO",
			type: "logTitle",
			columns: [{
					label: "日志单号",
					prop: "notransId",

				},
				{
					label: "开始日期",
					prop: "moveStartTime",
				},
				{
					label: "预计结束日期",
					prop: "moveEndTime",
				},
				{
					label: "线路起点",
					prop: "startPosAddr",
				},
				// {
				//   label: "线路起点所在区县行政区划代码",
				//   prop: "startPosZipCode",
				// },
				{
					label: "线路终点",
					prop: "endPosAddr",
				},
				// {
				//   label: "线路终点所在区县行政区划代码",
				//   prop: "endPosZipCode",
				// },
				{
					label: "车牌号码",
					prop: "vehCode",
				},
				{
					label: "车牌颜色",
					prop: "vehColor",
				},
				{
					label: "挂车车牌号码",
					prop: "trailerNo",
				},
				{
					label: "活动事由",
					// prop: "type",
					// format: (index) => {
					//   return (
					//     this.selectOptions.ccert_state_obj[
					//     this.collapseData[index].ccertState
					//     ] || ""
					//   );
					// },
				},
				{
					label: "具体事宜",
					prop: "note",
				},
				{
					label: "填报日期",
					prop: "createTime",
				},

			],
		},
	],
	"province-other": [{
			title: "车辆基本信息",
			prop: "rwVehicleBaseVO",
			columns: [{
					label: "车牌号(颜色)",
					format: (index) => {
						let veColor =
							collapseData[index].vehColor &&
							`(${collapseData[index].vehColor})`;
						return `${collapseData[index].vehCode}${veColor || ""}`;
					},
				},
				{
					label: "营运状态",
					prop: "ccertState",
				},
				{
					label: "经营范围",
					prop: "mgrArea",
				},
				{
					label: "道路运输证号",
					prop: "ccertId",
				},
				{
					label: "有效期止",
					prop: "expireDate",
				},
				{
					label: "发证机构",
					prop: "fa",
				},
				{
					label: "所属企业",
					prop: "ownerName",
				},
			],
		},
		{
			title: "运单信息",
			type: "title2",
		},
		{
			title: "运单基本信息",
			prop: "wayBillInfoVO",
			type: "title3",
			columns: [{
					label: "运单编号",
					prop: "billNo",
				},
				{
					label: "起运地",
					prop: "loadingAddr",
				},
				{
					label: "目的地",
					prop: "unloadingAddr",
				},
				{
					label: "起运日期",
					prop: "startTransTime",
					format: (index) => {
						return collapseData[index].startTransTime.slice(0, 10);
					},
				},
				{
					label: "到达日期",
					prop: "endTransTime",
					format: (index) => {
						return collapseData[index].endTransTime.slice(0, 10);
					},
				},
				{
					label: "货物信息",
					prop: "goodsInfo",
				},
			],
		},
		{
			title: "挂车信息",
			prop: "trailerInforVO",
			type: "title3",
			columns: [{
					label: "挂车车牌号",
					format: (index) => {
						let str = collapseData[index].vehCode;
						str += collapseData[index].vehColor ?
							`(${collapseData[index].vehColor})` :
							"";
						return str;
					},
				},
				{
					label: "营运状态",
					prop: 'ccertState',
					// format: (index) => {
					// 	return (
					// 		selectOptions.ccert_state_obj[
					// 			collapseData[index].ccertState
					// 		] || ""
					// 	);
					// },
				},
				{
					label: "经营范围",
					prop: "mgrArea",
				},
				{
					label: "道路运输证号",
					prop: "ccertId",
				},
			],
		},
		{
			title: "驾押人员信息",
			prop: "staffInfoVO",
			type: "title3",
			columns: [{
					label: "驾驶员姓名",
					prop: "driverName",
				},
				{
					label: "从业资格证",
					prop: "driverCertNo",
				},
				{
					label: "押运员姓名",
					prop: "escortName",
				},
				{
					label: "从业资格证",
					prop: "escortCertNo",
				},
			],
		},
		{
			title: "行车日志",
			prop: "outTrafficVO",
			type: "logTitle",
			columns: [{
					label: "日志单号",
					prop: "notransId",

				},
				{
					label: "开始日期",
					prop: "moveStartTime",
				},
				{
					label: "预计结束日期",
					prop: "moveEndTime",
				},
				{
					label: "线路起点",
					prop: "startPosAddr",
				},
				// {
				//   label: "线路起点所在区县行政区划代码",
				//   prop: "startPosZipCode",
				// },
				{
					label: "线路终点",
					prop: "endPosAddr",
				},
				// {
				//   label: "线路终点所在区县行政区划代码",
				//   prop: "endPosZipCode",
				// },
				{
					label: "车牌号码",
					prop: "vehCode",
				},
				{
					label: "车牌颜色",
					prop: "vehColor",
				},
				{
					label: "挂车车牌号码",
					prop: "trailerNo",
				},
				{
					label: "活动事由",
					// prop: "type",
					// format: (index) => {
					//   return (
					//     this.selectOptions.ccert_state_obj[
					//     this.collapseData[index].ccertState
					//     ] || ""
					//   );
					// },
				},
				{
					label: "具体事宜",
					prop: "note",
				},
				{
					label: "填报日期",
					prop: "createTime",
				},

			],
		},
	],
};
let selectOptions;
const receiveData = (str) => {
	const data = JSON.parse(str);
	// linePath = data.linePath;
	collapseData = data.collapseData;
	// console.log(str)
	// data.collapseData.outTrafficVO = {}
	collapseColumns = collapseColumns[data.context];
	selectOptions = data.selectOptions;
	// 初始化数据
	initContent(data);
	AMapConvertFrom(data.linePath)
		.then(res => {
			linePath = res.map((item) => {
				return {
					latitude: item.lat,
					longitude: item.lon,
					time: item.gpsDateTime,
				};
			});
			init();
		}).catch((err) => {
			console.log(err);
		})
};

// document.getElementsByClassName(".tab")[0].addEventListener('click', () => {
// 	console.log(322)
// 	// $('.speed-list').style.display = 'block';
// })
// 计算两个点之间的速度 km/h
const speedFun = (point1, point2, time) => {
	// point1,point2:经纬度数组，time:时间，s
	let distance = distanceFun(point1, point2);
	if (distance === 0) {
		return 0;
	} else {
		return distance / 1000 / (time / 60 / 60);
	}
};
// 修改倍速
const setTimes = (val) => {
	times = val;
	$('.speed-list').style.display = "none";
	$('.map-times').innerHTML = "倍速" + val;
};
// 格式化时间
const getTime = (sTime) => {
	let ss;
	let mm = "00";
	let hh = "00";
	if (sTime > 60) {
		let s = sTime % 60;
		ss = s > 9 ? s : "0" + s;
		let mTime = parseInt(sTime / 60);
		if (mTime > 60) {
			let m = mTime % 60;
			mm = m > 9 ? m : "0" + m;
			hh = parseInt(mTime / 60);
		} else {
			mm = mTime > 9 ? mTime : "0" + mTime;
		}
	} else {
		ss = sTime > 9 ? sTime : "0" + sTime;
	}
	return hh + ":" + mm + ":" + ss;
};
// 计算两个坐标点之间的距离
const distanceFun = (point1, point2) => {
	// point1:[longitude,latitude]
	let p1 = new AMap.LngLat(point1[0], point1[1]);
	let p2 = new AMap.LngLat(point2[0], point2[1]);
	let distance = Math.round(p1.distance(p2));
	return distance;
};
// 初始化
const init = () => {
	let len = linePath.length;
	if (len < 2) {
		alert('没有轨迹点')
		return;
	}
	$('.map-control').style.display = '';
	let startPoint = linePath[0];
	let endPoint = linePath[len - 1];

	// 添加起始点和终点
	new AMap.Marker({
		map,
		position: new AMap.LngLat(startPoint.longitude, startPoint.latitude),
		icon: new AMap.Icon({
			size: new AMap.Size(37, 51),
			image: '../../../static/img/start.png',
			imageSize: new AMap.Size(37, 51),
		}),
		offset: new AMap.Pixel(0, -26),
		anchor: "center",
	});
	new AMap.Marker({
		map,
		position: new AMap.LngLat(endPoint.longitude, endPoint.latitude),
		icon: new AMap.Icon({
			size: new AMap.Size(37, 51),
			image: '../../../static/img/end.png',
			imageSize: new AMap.Size(37, 51),
		}),
		offset: new AMap.Pixel(0, -26),
		anchor: "center",
	});


	pathList.splice(0, pathList.length);
	linePath.forEach((item) => {
		pathList.push([item.longitude, item.latitude]);
		item.stampTime = new Date(item.time).getTime(); //当前时间戳
	});
	// 下一段路程经历了多少s,intervalTime,nextDistance:下一段路程：m,nextDistance:下一段路速度：km/h
	linePath.forEach((item, i) => {
		let next = linePath[i + 1];
		if (next) {
			item.intervalTime = (next.stampTime - item.stampTime) / 1000;
			item.nextDistance = distanceFun(
				[item.longitude, item.latitude],
				[next.longitude, next.latitude]
			);
			item.nextSpeed =
				item.nextDistance / 1000 / (item.intervalTime / 60 / 60);
		}
	});
	// 订单记录总时间，hh:mm:ss
	totalTime = getTime(
		(endPoint.stampTime - startPoint.stampTime) / 1000
	);
	setPath();
};
// 开启手动拖拽
const openSlider = () => {
	isOnSlider = true;
};
// 关闭手动拖拽
const closeSlider = () => {
	isOnSlider = false;
};
const sliderChange = (newVal) => {
	let num = parseInt((newVal / 100) * pathList.length);
	let decimal = num % 1 || 0;
	navgtr.moveToPoint(num, decimal);
	pathSimplifierIns.renderLater();
};

// 开始、暂停、继续等操作
const navgControl = (action) => {
	if (action === 'pause') {
		$('.pause').style.display = 'none';
		$('.resume').style.display = '';
	} else {
		$('.pause').style.display = '';
		$('.resume').style.display = 'none';
	}
	if (action === "start") {
		sliderVal = 0;
		passedTime = "00:00:00";
		setTimeout(() => {
			navgtr[action]();
		}, 300);
	} else {
		navgtr[action]();
	}
};
// 设置巡航路线
const setPath = () => {
	AMapUI.load(
		["ui/misc/PathSimplifier", "lib/$"],
		function(PathSimplifier) {
			if (!PathSimplifier.supportCanvas) {
				console.log("当前环境不支持 Canvas！");
				return;
			}
			let len = linePath.length;
			let startPoint = linePath[0];
			let endPoint = linePath[len - 1];
			// 轨迹总数
			function onload() {
				pathSimplifierIns.renderLater();
			}

			function onerror() {
				console.log("图片加载失败！");
			}
			// 历史轨迹巡航器
			pathSimplifierIns = new PathSimplifier({
				zIndex: 100,
				//autoSetFitView:false,
				map, //所属的地图实例
				getPath: function(pathData) {
					return pathData.path;
				},
				getHoverTitle: function(pathData) {
					return pathData.index;
				},
				autoSetFitView: true,
				// 巡航器样式
				renderOptions: {
					pathNavigatorStyle: {
						initRotateDegree: -90, // 图标的默认角度
						width: 32,
						height: 20,
						autoRotate: true,
						lineJoin: "round",
						content: PathSimplifier.Render.Canvas.getImageContent(
							car,
							onload,
							onerror
						),
						fillStyle: null,
						strokeStyle: null,
						lineWidth: 1,
						pathLinePassedStyle: {
							lineWidth: 6,
							strokeStyle: "#2cdf4d",
						},
					},
					pathLineStyle: {
						lineWidth: 6,
						strokeStyle: "#2e9c08",
					},
					pathLineHoverStyle: {
						lineWidth: 0,
						borderWidth: 0,
					},
					pathLineSelectedStyle: {
						lineWidth: 6,
						borderWidth: 0,
						strokeStyle: "#2e9c08",
					},
					pathTolerance: 0,
					keyPointTolerance: -1,
					renderAllPointsIfNumberBelow: 0, //绘制路线节点，如不需要可设置为-1
				},
			});

			//历史轨迹巡航器设置数据
			pathSimplifierIns.setData([{
				name: "轨迹",
				path: pathList,
			}, ]);
			pathSimplifierIns.setFitView(-1);

			let startSpeed = speedFun(
				pathList[0],
				pathList[1],
				startPoint.intervalTime
			);
			startSpeed === 0 && (startSpeed = 0.1);

			//对第一条线路（即索引 0）创建一个巡航器
			navgtr = pathSimplifierIns.createPathNavigator(0, {
				loop: false, //循环播放
				speed: startSpeed * times, //巡航速度，单位千米/小时
			});
			// console.log(startPoint);
			//构建自定义信息窗体
			let infoContent = `<p class="info-window">时间：<span>${startPoint.time} `;
			let infoWindow = new AMap.InfoWindow({
				anchor: "bottom-center",
				content: infoContent,
			});

			infoWindow.open(map, pathList[0]);
			// 移动过程中
			navgtr.on("move", function() {
				playIcon = "resume";
				let idx = this.getCursor().idx; //走到了第几个点
				let tail = this.getCursor().tail; //至下一个节点的比例位置
				let totalIdx = idx + tail;

				// 计算下一个距离速度
				let point = linePath[idx];
				if (idx < len - 1) {
					point.nextSpeed === 0 && (point.nextSpeed = 0.1);
					navgtr.setSpeed(point.nextSpeed * times);
				}

				// 剩余公里数，窗体随时移动展示
				point &&
					point.time &&
					infoWindow.setContent(
						`<p class="info-window">时间：<span>${point.time}`
					);
				infoWindow.open(map, navgtr.getPosition());
				// 进度条实时展示tail
				!isOnSlider && setSlider((totalIdx / (len - 1)) * 100);
				// 已经播放时间
				// let sTime = (pointObj.stampTime-startStampTime)/1000;
				let sTime = parseInt(
					(((endPoint.stampTime - startPoint.stampTime) / 1000) *
						sliderVal) /
					100
				);

				passedTime = getTime(sTime);
				// 如果到头了，回到初始状态
				if (navgtr.isCursorAtPathEnd()) {
					playIcon = "start";
					isPlay = false;
					sliderVal = 100;
					passedTime = totalTime;
				}
			});

			navgtr.on("start resume", function() {
				navgtr._startTime = Date.now();
				navgtr._startDist = this.getMovedDistance();
			});
			navgtr.on("stop pause", function() {
				navgtr._movedTime = Date.now() - navgtr._startTime;
				navgtr._movedDist =
					this.getMovedDistance() - navgtr._startDist;
			});
		}
	);
};
// 坐标系转换
const AMapConvertFrom = (locations, type = "gps") => {
	return new Promise((resolve, reject) => {
		const pages = Math.ceil(locations.length / 500);
		if (pages == 0) {
			resolve([])
			return;
		}
		let res = [];
		let resIndex = 0;
		let resState = true;
		for (let i = 0; i < pages; i++) {
			const locationsSlice = locations.slice(500 * i, 500 * (i + 1));
			const LngLat = locationsSlice.map((item) => [item.lon, item.lat]);
			AMap.convertFrom(LngLat, type, function(status, result) {
				resIndex++;
				if (result.info === "ok") {
					// console.log(locations, result.locations);
					res[i] = locationsSlice.map((item, index) => {
						item.lon = result.locations[index].lng;
						item.lat = result.locations[index].lat;
						return item;
					});
				} else {
					resState = false;
				}
				if (resIndex == pages) {
					if (resState) {
						res = res.flat();
						resolve(res);
					} else {
						reject();
					}
				}
			});
		}
	});
};

// 获取字段内容
const getContent = (item, prop) => {

	if (collapseData) {
		const propContent = item.format ?
			item.format(prop) :
			collapseData[prop][item.prop];
		return propContent;
	} else {
		return "&nbsp;";
	}
};

// 初始化文字内容
const initContent = (data) => {
	let html = '';
	let isShow = false
	let status = collapseData.wayBillInfoVO.billState
	if (!collapseData.wayBillInfoVO.billNo) {
		isShow = true
	}
	collapseColumns.forEach((items, index) => {
		html += `<div class="items-box">`
		if (items.type == 'title2') {
			// html += `<div>
			// 		<div class="title2">
			// 			<div class="text">${ items.title }</div>
			// 			<div class="text-bg"></div>
			// 		</div>
			// 	</div>`
			if (isShow) {
				html += `<div></div>`
			} else if (status != '') {
				html += `<div>
							<div class="title">
								<div class="text">${ items.title }</div>
							</div>
							<img src='./${status}.png' class="img">
						</div>`
			} else {
				html += `<div>
							<div class="title">
								<div class="text">${ items.title }</div>
							</div>
						</div>`
			}

		} else if (items.type == 'title3') {
			if (isShow) {
				html += `<div></div>`
			} else {
				// html += `
				// <div class='tab'>
				// 	<img src='./up.png' class="up_img">
				// 	<img src='./down.png' class="down_img">
				// 	<div class="title2">${items.title}</div>
				// </div>
				// `

				html += `
				<div class='tab'>
					<div class="title2">${items.title}</div>
				</div>
				`
				items.columns.forEach((item, i) => {
					html += `
						<div class="item-box waybill">
							<div class="label">
								<div class="dian"></div>
								${item.label}:
							</div>
							<div class="text">${getContent(item, items.prop)}</div>
						</div>`
				})
			}

		} else {
			if (items.type == 'table') {
				// <img src='./up.png' class="up_table">
				// <img src='./down.png' class="down_table">
				html += `
				
				<div class="title titleClick">${items.title}</div>`
				html += `<div class="table1">
						<table cellspacing="0" cellpadding="0" border="1">
							<tr>`
				items.columns.forEach(ik => {
					html += `<th>${ik.label}</th>`
				})
				html += `</tr>`

				if (Object.keys(collapseData[items.prop]).length !== 0) {
					collapseData[items.prop].forEach((item, i) => {
						html += `<tr class='isTr'>`
						items.columns.forEach(ik => {
							html += `<td class="text">${item[ik.prop]}</td>`
						})
						html += `</tr>`
					})
				}
				html += `</table>
					</div>`
			} else {
				if (items.type == 'logTitle') {
					if (!isShow) {
						html += `<div></div>`
					} else {
						html += `<div class="title">${items.title}</div>`
						items.columns.forEach((item, i) => {
							html += `<div class="item-box">
									<div class="label">
										<div class="dian"></div>
										${item.label}:
									</div>
									<div class="text">${getContent(item, items.prop)}</div>
								</div>`
						})
					}

				} else {
					html += `<div class="title">${items.title}</div>`
					items.columns.forEach((item, i) => {
						html += `<div class="item-box">
							<div class="label">
								<div class="dian"></div>
								${item.label}:
							</div>
							<div class="text">${getContent(item, items.prop)}</div>
						</div>`
					})
				}

			}
		}
		html += `</div>`;
	})
	$('.content').innerHTML = html;

	// let arr = ['0,5', '6,13', '14,17']

	// let arrList = ['0,5', '6,9', '10,13']

	let obj = {
		'province-this': ['0,5', '6,12', '13,16'],
		'province-other': ['0,5', '6,9', '10,13'],
	}
	// data.context
	for (let i = 0; i < 3; i++) {

		// $('.up_img', i).style.display = 'none'

		// $('.tab', i).addEventListener('click', (event) => {
		// 	if ($('.up_img', i).style.display == 'none') {
		// 		$('.up_img', i).style.display = ''
		// 		$('.down_img', i).style.display = 'none'
		// 		for (var k = Number(obj[data.context][i].split(',')[0]); k <= obj[data.context][i].split(
		// 				',')[1]; k++) {
		// 			$('.waybill', k).style.display = 'none'
		// 		}
		// 	} else {
		// 		$('.up_img', i).style.display = 'none'
		// 		$('.down_img', i).style.display = ''

		// 		for (var k = Number(obj[data.context][i].split(',')[0]); k <= obj[data.context][i].split(
		// 				',')[1]; k++) {
		// 			$('.waybill', k).style.display = ''
		// 		}
		// 	}
		// });


		if (data.context == 'province-this') {
			$('.up_table', i).style.display = 'none'
			
			//新增
			$('.down_table', i).style.display = 'none'

			// $('.titleClick', i).addEventListener('click', (event) => {
			// 	if ($('.up_table', i).style.display == 'none') {
			// 		$('.up_table', i).style.display = ''
			// 		$('.down_table', i).style.display = 'none'
			// 		$('.table1', i).style.display = 'none'

			// 	} else {
			// 		$('.up_table', i).style.display = 'none'
			// 		$('.down_table', i).style.display = ''
			// 		$('.table1', i).style.display = ''
			// 	}
			// });
		}


	}


}
// 根据ClassName/Id获取dom
const $ = (str, index) => {
	if (str.startsWith('.')) {
		return document.getElementsByClassName(str.slice(1))[index ? index : 0]
	}
	if (str.startsWith('#')) {
		return document.getElementById(str.slice(1));
	}
	return null;
}
/**
 * 以下为滑块事件
 */
// 修改滑块当前值
const setSlider = (val) => {
	$('.slider-color').style.width = val + '%';
	handle.style.left = val + '%'; // 根据鼠标位置移动滑块
	if (isOnSlider) {
		sliderChange(val);
	}
}
let startX;
let handle = $('.slider-wrapper');
let slider = $('.slider-box');
handle.addEventListener('touchstart', (event) => {
	openSlider();
	startX = event.changedTouches[0].clientX - handle.offsetLeft; // 保存初始位置
}, false);
document.addEventListener('touchmove', (event) => {
	if (isOnSlider) {
		var newLeft = event.changedTouches[0].clientX - startX;
		if (newLeft < 0) {
			newLeft = 0;
		} else if (newLeft > slider.offsetWidth) {
			newLeft = slider.offsetWidth;
		}
		setSlider(newLeft / slider.offsetWidth * 100);
	}
}, false);
document.addEventListener('touchend', (event) => {
	if (isOnSlider) {
		var newLeft = event.changedTouches[0].clientX - startX;
		if (newLeft < 0) {
			newLeft = 0;
		} else if (newLeft > slider.offsetWidth) {
			newLeft = slider.offsetWidth;
		}
		setSlider(newLeft / slider.offsetWidth * 100);
		closeSlider();
	}
}, false);

$('.map-times').addEventListener('click', () => {
	$('.speed-list').style.display = 'block';
})